<template>
    <div class="nav">
        <ul>
            <li v-for="item in arr"><a href="#">{{item}}</a></li>
        </ul>
    </div>
</template>

<script setup lang="ts">
import {ref} from 'vue';
const arr=ref(["集团介绍","产品中心","卧龙市场","技术研发","国际合作","投资者关系","新闻资讯","人力资源"])
</script>

<style lang="less" scoped>
.nav{
    height: 60px;
    line-height: 60px;
    background-color: black;
    ul{
        display: flex;
        list-style: none;
        li{
            flex:1;//等比例分配空间
            text-align: center;
            border-right: 1px solid #ccc ;
            a{
                color: #ffffff;
                text-decoration: none;
            }
        }
    }
}
</style>